// 引入样式
//1.常态化样式,设置适用于大部分浏览器
require("../../assets/css/normalize.css");
//2.重置样式
require("../../assets/css/reset.css");
// 3.引入阿里矢量图
require("../../assets/fonts/iconfont.css");
//4.自身样式
require("./index.less");
//5.引入公共底部模板
require("../../assets/css/tabbar.less");
//引入模块
//1.引入工具utils.js
const dom = require("../../utils/dom");
//2.引入axios
const axios = require("axios");

//引入swiper
require("../../libs/swiper/swiper-bundle.min.css");
const Swiper = require("../../libs/swiper/swiper-bundle.min.js");

document.addEventListener("DOMContentLoaded", function () {
	// 渲染底部
	dom.tabbar("index");
	//轮播图配置
	var mySwiper = new Swiper(".swiper", {
		loop: true, // 循环模式选项

		// 如果需要分页器
		pagination: {
			el: ".swiper-pagination",
		},

		autoplay: {
			delay: 1000,
			stopOnLastSlide: false,
			disableOnInteraction: false,
		},
	});

	//获取token令牌
	let token = localStorage.getItem("token");
	//基础网址：主机+域名+端口
	axios.defaults.baseURL = "http://fitness.h5.itsource.cn:3701";
	//设置携带令牌的请求头
	axios.defaults.headers.common["Authorization"] = "Bearer " + token;
	//发请求获取用户个人信息以便于获取对应的用户数据
	axios.get("/api/user/info").then((res) => {
		let data = res.data.data;

		//渲染排名
		dom.get("#rankNum").textContent = data.ranking;

		//渲染徽章
		dom.get("#badgeNum").textContent = data.badges;
	});

	// 渲染打卡信息
	function randerClockin() {
		//发送用户打卡请求
		axios.get("/api/user/clockInInfo").then((res) => {
			let data = res.data.data;

			//渲染累计打卡天数
			dom.get("#clockNum").textContent = data.clockCount;
			//打卡设定
			let clockBtn = dom.get("#clockBtn");

			if (data.isClockIn) {
				clockBtn.disabled = true;
				clockBtn.style.backgroundColor = "#f8f9f9";
				clockBtn.style.color = " #0864b4";
				clockBtn.textContent = "已打卡";
			}
		});
	}
	randerClockin();

	clockBtn.addEventListener("click", function () {
		//发请求打卡
		axios.post("/api/user/clockIn").then((res) => {
			if (res.data.errno === 0) {
				randerClockin();
				alert("打卡成功!又是身心舒畅的一天");
			}
		});
	});
});
